<template>
  <div class="exp">
       <div class="head"><span class="ht" @click="fun()">&lt;</span><span>积分商城说明</span></div>
      <div class="cen">
        <ul class="rule">
          <li class="fir">签到规则</li>
          <li>连续签到1天 3积分</li>
          <li>连续签到2天 5积分</li>
          <li>连续签到3天 7积分</li>
          <li>连续签到4天 7积分</li>
          <li>连续签到5天 7积分</li>
        </ul>
        <ul class="rule">
          <li class="fir">1.什么是积分</li>
          <li>生日管家的积分是生日管家对用户签到，记生日，购物等行为的奖励</li>
        </ul>
        <ul class="rule">
          <li class="fir">2.积分能干什么</li>
          <li>1.在生日管家上购买商品可以使用积分抵扣现金，每100积分可抵1元现金</li>
          <li>2.在生日管家的积分商城中免费兑换礼品，代金券以及其他专属优惠</li>
          <li>3.以超低价在生日管家的积分商城中换购商品</li>
        </ul>
      </div>
  </div>
</template>

<script>
export default {
    methods: {
        fun(){
            this.$router.push("/detailed")
        }
    },
}
</script>

<style scoped>
*{
    margin: 0;
    padding: 0;
}
div{
    font-size: 0;
}
.head{
  width: 100%;
  height:0.4rem;
  border-bottom: 0.01rem solid rgb(190, 170, 170);
  position: fixed;
  top: 0;
  z-index: 999;
  background-color: #fff;
}
.head span{
    font-size: 0.14rem;
    line-height: 0.4rem;
}
.head .ht{
  font-size: 0.26rem;
  padding:0 0.2rem;
  color:red;
}
.cen{
  position: absolute !important;
  position: relative;
  top: 0.4rem !important;
  width: 100%;
  height: 100%;
}
.cen .rule{
  width: 100%;
  height:auto;
  font-size: 0.14rem;
  border-bottom: 0.01rem solid rgb(209, 192, 192);
}
.cen .rule li{
  width: 80%;
  height: auto;
  padding-left: 0.2rem;
  overflow: auto;
}
.cen .rule .fir{
  width: 100%;
  height: 0.3rem;
  line-height: 0.3rem;
  margin: 0.1rem 0;
  font-size: 0.16rem;
  border-bottom: 0.01rem solid rgb(209, 192, 192);
}
</style>